<template>
    <view>
        <view class="page" v-if="data.length">
            <view class="item" v-for="(item, index) in data" :key="index">
                <view class="title">{{ item.cookbookName }}</view>
                <view class="row">
                    <view>
                        <text>推荐人：</text>
                        {{ item.userName }}
                    </view>
                    <view>
                        <text>推荐时间：</text>
                        {{ item.recommendTime }}
                    </view>
                </view>
                <view class="row">
                    <view>
                        <text>排序值：</text>
                        {{ item.orderNum }}
                    </view>
                    <view>
                        <text>推荐方式：</text>
                        {{ getPushType(item.pushType) }}
                    </view>
                </view>
                <image src="https://smosun-minapp.oss-cn-shanghai.aliyuncs.com/weapp/img/delete_dynamic.png" class="icon" @click="onDelete(item)" />
            </view>
            <picker @change="onChangeValue" :range="list" range-key="name">
                <view class="btn">选择食谱推荐</view>
            </picker>
        </view>

        <view class="_empty" v-else>
            <image src="https://admin.ximusen.cn/profile/upload/ximusen_mini_app_img/noShiPu.png" class="image" />
            <view class="title">暂无推荐食谱</view>
            <picker @change="onChangeValue" :range="list" range-key="name">
                <view class="btn">选择食谱推荐</view>
            </picker>
        </view>
    </view>
</template>

<script>
import { mapState, mapMutations } from "vuex";

export default {
    data() {
        return {
            data: [],
            list: [],
            userId: "",
        };
    },
    computed: {
        ...mapState(["userInfo"]),
    },
    methods: {
        async getEmpCookbook() {
            const {
                data: { list },
            } = await this.request.httpTokenJsonRequest("/mp-api/wx/empCookbook/list", { userId: this.userId }, "get");
            this.data = list;
        },
        async getUnEmpCookbook() {
            const { data } = await this.request.httpTokenJsonRequest(
                `/mp-api/wx/empCookbook/query/${this.userId}`,
                {},
                "get",
            );
            this.list = data;
        },
        getPushType(pushType) {
            return pushType === 0 ? "规则推送" : pushType === 1 ? "手动推送" : "未知";
        },
        async onDelete(item) {
            const [, { confirm }] = await uni.showModal({ content: "是否确认删除此推荐食谱？" });
            if (confirm) {
                await this.request.httpTokenJsonRequest(`/mp-api/wx/empCookbook/${item.id}`, {}, "delete");
                this.getEmpCookbook();
                uni.showToast({
                    title: "推荐食谱删除成功",
                    icon: "none",
                });
            }
        },
        async onChangeValue(e) {
            const { userId } = this;
            const { id } = this.list[Number(e.detail.value)];
            await this.request.httpTokenJsonRequest("/mp-api/wx/empCookbook/customer", { userId, id }, "post");
            this.getEmpCookbook();
            uni.showToast({
                title: "推荐食谱添加成功",
                icon: "none",
            });
        },
    },
    onLoad(options) {
        this.userId = options.userId;
        this.getEmpCookbook();
        this.getUnEmpCookbook();
    },
};
</script>

<style lang="less" scoped>
@import url("./index.less");
</style>
